<template>
  <div id="components-layout-demo-basic">
    <a-layout>
      <!-- <p><router-link :to="{ path: 'ucenter' }">个人中心</router-link></p> -->
      <a-layout-header>
        <!-- 走马灯 -->
        <a-carousel class="banner">
          <div v-for="(item,index) in actData.carpusel"  :key="index">
            <h3>
              <img :src="item.url" alt />
            </h3>
          </div>
        </a-carousel>
        <!-- 活动信息 -->
        <ActInfo v-if="actData" :act-data='actData'/>
      </a-layout-header>
      <a-layout-content>
        <!-- 商家宣传 -->
        <PopContent/>
      </a-layout-content>
      <a-layout-footer>
        &copy; 合众易成信息技术咨询服务有限公司
      </a-layout-footer>
    </a-layout>
    <!-- 浮动导航 -->
    <FixedMenu :infos='actData.info'/>
    <!-- 回到顶部 -->
    <a-back-top />
  </div>
</template>
<script>
// 活动信息
import ActInfo from './act/ActInfo'
// 宣传内容
import PopContent from './act/PopContent'
// 浮动导航
import FixedMenu from './act/FixedMenu'
// 微信分享api
import wxapi from "@/tools/wxapi.js";
export default {
  data(){
    return{
      actData:{}
    }
  },
  mounted(){
    let o = this.$route.query,vo = this;
    if(Object.keys(o).length>0){
      let url = `backstage/getPage1Info.do?id=${o.id}`;
      vo.ajax.get(url).then(res=>{
          vo.actData = res.data;
          console.log(res.data);
          //微信分享接口
          
          wxapi.wxRegister(vo.wxRegCallback);
      }) 
    }
  },
  methods: {
    wxRegCallback() {
      let vo = this; 
      let desc_txt = vo.actData&&vo.actData.info.name;
      // 用于微信JS-SDK回调
      this.wxShareTimeline(desc_txt);
      this.wxShareAppMessage(desc_txt);
    },
    wxShareTimeline(desc_txt) {
      let vo = this;
      // 微信自定义分享到朋友圈

      let url = window.location.href.split('#')[0].split('&')[0];
      url = url+`&helperid=${vo.$store.state.ownid}`;
      
      let option = {
        title: '1元抵522元！限时抢原价1000元课程！', // 分享标题, 请自行替换
        desc:'立减522元，假期大放送！',
        link: `${url}`, // 分享链接，根据自身项目决定是否需要split
        imgUrl: document.images[0].src, // 分享图标, 需要绝对路径
        success: () => {
          console.log("分享成功");
        },
        error: () => {
          console.log("已取消分享");
        }
      };
      // 将配置注入通用方法
      wxapi.ShareTimeline(option);
    },
    wxShareAppMessage(desc_txt) {
      let vo = this;
      // 微信自定义分享给朋友

      let url = window.location.href.split('#')[0].split('&')[0];
      url = url+`&helperid=${vo.$store.state.ownid}`;
      
      let option = {
        title: '1元抵522元！限时抢原价1000元课程！', // 分享标题, 请自行替换
        desc:'立减522元，假期大放送！',
        link: `${url}`, // 分享链接，根据自身项目决定是否需要split
        imgUrl: document.images[0].src, // 分享图标, 需要绝对路径
        success: () => {
          console.log("分享成功");
        },
        error: () => {
          console.log("已取消分享");
        }
      };
      // 将配置注入通用方法
      wxapi.ShareAppMessage(option);
    }
  },
  components:{
    ActInfo,
    PopContent,
    FixedMenu
  }
}
</script>
<style lang='less' scoped>
/* layout布局 */
#components-layout-demo-basic {
  // text-align: center;
}
#components-layout-demo-basic .ant-layout-header,
#components-layout-demo-basic .ant-layout-footer {
  background: transparent!important;
  height: auto;
  padding: 0;
  line-height: normal;
}
.ant-layout-footer{
  text-align: center;
}
#components-layout-demo-basic .ant-layout-footer {
  background: #f3f3f3;
  color: #a9a9a9;
  padding: 5px 0;
  line-height: 1.5;
}
#components-layout-demo-basic .ant-layout-content {
  color: #000;
  min-height: 120px;
  line-height: 120px;
}
#components-layout-demo-basic {
  .ant-layout:last-child {
    margin: 0;
  }
}

/* 走马灯 */
.banner {
  position: relative;
  text-align: center;
  background: #fff;
  overflow: hidden;
  line-height: 0;
  padding-top: 115.942%;
  height:0;
  background: url("../assets/bg_slide_nocover.png") #eee no-repeat center
    center;
  background-size: 100% auto;
  h3{
    margin-bottom: 0;
  }
  img {
    width: 100%;
    transition: all 0.2s;
  }
}
/deep/.banner .slick-slider{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
}
</style>
